import ReactDOM from 'react-dom/client';
import { Provider } from 'react-redux';
import { ConfigProvider, App } from 'antd';
import loadable from '@loadable/component';
import zhCN from 'antd/es/locale/zh_CN';
import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';
dayjs.locale('zh-cn'); // 全局使用简体中文

import store from '@/store'; // redux的store
import Application from './App'; // 引入组件
import ErrorBoundary from '@/components/ErrorBoundary';
import Empty from '@/components/Empty';
import { getVarColor } from '@/utils'; // 引入工具函数

import './index.css'; // 全局样式

const rootElement = document.getElementById('root');
ReactDOM.createRoot(rootElement).render(
    <Provider store={store}>
        <ConfigProvider
            locale={zhCN}
            renderEmpty={Empty}
            theme={{
                cssVar: true,
                token: {
                    colorBgBase: getVarColor('--rt-base-bg-color'),
                    colorPrimary: getVarColor('--rt-primary-color'),
                    colorTextPlaceholder: getVarColor('--gray-7'),
                    colorBorder: getVarColor('--gray-4'),
                    screenXSMax: 640,
                    screenSMMin: 640,
                    screenSM: 640,
                    screenSMMax: 768,
                    screenMDMin: 768,
                    screenMD: 768,
                    screenMDMax: 1024,
                    screenLGMin: 1024,
                    screenLG: 1024,
                    screenLGMax: 1280,
                    screenXLMin: 1280,
                    screenXL: 1280,
                    screenXLMax: 1536,
                    screenXXLMin: 1536,
                    screenXXL: 1536,
                    
                },
                components: {
                    Menu: {
                        activeBarBorderWidth: 0,
                        itemColor: getVarColor('--gray-8'),
                        itemSelectedBg: getVarColor('--main-6'),
                        itemSelectedColor: getVarColor('--white'),
                    },
                    Button: {
                        contentFontSizeSM: 12,
                    }
                }
            }}
        >
            <App style={{width:'100%',height:'100%'}}>
                <ErrorBoundary>
                    <Application />
                </ErrorBoundary>
            </App>
        </ConfigProvider>
    </Provider>
)
